Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: set cache control for only _next folder #851

Merged
merged 1 commit into from
Nov 1, 2024
Merged

Conversation

dcshzj
Copy link
Contributor

@dcshzj dcshzj commented Nov 1, 2024

Problem

We currently do a complete invalidation on CloudFront, which has some race condition issues and causes visitors to encounter an irresponsive website.

Solution

Breaking Changes

  • Yes - this PR contains breaking changes
  • No - this PR is backwards compatible

Bug Fixes:

  • Update the publisher script such that when we upload the files to S3, we set all page content to have a low cache of 10 minutes, whereas all JS and CSS files inside the _next folder has a much longer cache duration of 24 hours.
  • Remove the need to perform a distribution invalidation as the cache control setting now takes precedence.

@dcshzj dcshzj requested a review from a team as a code owner November 1, 2024 02:48
Copy link

vercel bot commented Nov 1, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
isomer-studio ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 1, 2024 2:50am

@datadog-opengovsg
Copy link

datadog-opengovsg bot commented Nov 1, 2024

Datadog Report

Branch report: fix/set-cache-control
Commit report: b324b64
Test service: isomer-studio

✅ 0 Failed, 166 Passed, 34 Skipped, 34.34s Total Time
➡️ Test Sessions change in coverage: 1 no change

@@ -119,6 +124,3 @@ echo "ETag: $ETag"
jq '.Distribution.DistributionConfig' distribution.json > distribution-new.json
jq ".Origins.Items[0].OriginPath = \"/$SITE_NAME/$CODEBUILD_BUILD_NUMBER/latest\"" distribution-new.json > distribution-config.json
aws cloudfront update-distribution --id $CLOUDFRONT_DISTRIBUTION_ID --distribution-config file://distribution-config.json --if-match $ETag

# Invalidate CloudFront cache
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

if you don't invalidate, the max time for a change to be live is 30 mins of build + 10 mins of previous cache = 40 mins right

I think we should still invalidate the cache, but having the TTL longer for _next helps to solve for those weird edge cases where the old versions of the HTMLs are being loaded and is unable to find the right _next chunk

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hmm no, we can't invalidate because it is the CloudFront invalidation process that is opaque to us and caused us some issues. If we perform the invalidation, then the cached file in CloudFront gets removed, which then causes the 404 errors for the chunks that we were seeing earlier. We still want the old cached file in CloudFront to be retained so that in case users are still seeing the old index.html file which references these old chunks, they don't receive a 404.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

okay so what is the maximum time for a change to be live to MOPs now? is 10 mins + build time right?

If builds are still around 20-30 mins + 10mins, I think we still need to optimise this to be faster, but can be a future improvement

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah in the worst case would be 10 minutes + build times but I think we should accept this because otherwise we lose the benefits of having CloudFront provide the caching for us, which can affect our time to first byte.

@dcshzj dcshzj requested a review from harishv7 November 1, 2024 03:53
Copy link
Contributor

@harishv7 harishv7 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

lgtm with minor comments for future

@dcshzj dcshzj merged commit dcb57c0 into main Nov 1, 2024
16 checks passed
@dcshzj dcshzj deleted the fix/set-cache-control branch November 1, 2024 04:58
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants